<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleleaf.org">
<head th:insert="base">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form" action="" method="post" lay-filter = "editObj">
            <input type="hidden" name="id"/>
            <input id="goodImg" name="goodImg" type="hidden">
            <div class="layui-form-item">
                <label class="layui-form-label">
                </label>
                <div class="layui-input-inline" style="margin: 10px 0">
                    <img class="layui-upload-img" id="goodImgShow" width="200px" height="200px" style="vertical-align:middle;">
                    <p id="demoText"></p>
                </div>
                <div class="layui-form-mid layui-word-aux">
                </div>
            </div>
            <div class="layui-form-item">
                <label for="goodName" class="layui-form-label">
                    拍品名称
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="goodName" name="goodName" minlength="2" maxlength="20" lay-verify="range"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="goodNum" class="layui-form-label">
                    拍品数量
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="goodNum" name="goodNum" lay-verify="required"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="startPrice" class="layui-form-label">
                    起拍价
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="startPrice" name="startPrice"
                           autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="goodType" class="layui-form-label">
                    拍品类别
                </label>
                <div class="layui-input-inline">
                    <select id="goodType" name="goodType" class="valid" lay-verify="required">
                    </select>
                </div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>
                </div>
            </div>
            <div class="layui-form-item layui-form-text">
                <label for="endTime" class="layui-form-label">竞拍结束时间</label>
                <div class="layui-input-inline">
                    <input class="layui-input" readonly  autocomplete="off" placeholder="竞拍结束时间" id="endTime">
                </div>
            </div>
            <div class="layui-form-item layui-form-text">
                <label for="goodDesc" class="layui-form-label">拍品描述</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入拍品描述" id="goodDesc" name="goodDesc" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                </label>
                <button  class="layui-btn" lay-filter="edit" lay-submit="">
                    确认修改
                </button>
            </div>
        </form>
    </div>
</div>
<script th:inline="javascript">
    layui.use(['form','jquery','validate','upload','tool','laydate','auctionUtil'], function(){
        var form = layui.form;
        var $ = layui.jquery;
        var validate = layui.validate;
        var tool = layui.tool;
        var upload = layui.upload;
        var auctionUtil = layui.auctionUtil;
        var laydate = layui.laydate;
        var baseUrl = "/back/auctionGood";
        var auctionGood = [[${auctionGood}]];
        init_form();

        /**
         * 初始化页面
         */
        function init_form() {
            auctionUtil.createGoodType('goodType',null,'请选择拍品类别');
            form.render();
            laydate.render({
                elem: '#endTime'
                ,type: 'datetime'
            });
            $('#goodImgShow').attr('src', auctionGood.goodImg);
            form.val('editObj',{
                "id":auctionGood.id
                ,"goodImg":auctionGood.goodImg
                ,"goodName":auctionGood.goodName
                ,"goodNum":auctionGood.goodNum
                ,"startPrice":auctionGood.startPrice
                ,"goodType":auctionGood.goodType
                ,"goodDesc":auctionGood.goodDesc
            });
        }

        //添加表单校验
        form.verify(validate);

        upload.render({
            elem: '#goodImgShow'
            ,url: '/back/upload/singleFileUpload'
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#goodImgShow').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code != '0'){
                    return layer.msg('拍品图片上传失败',{
                        icon: 2,
                        time: 2000
                    });
                }
                //上传成功
                $("#goodImg").val(res.data.src);
                return layer.msg('拍品图片上传成功',{
                    icon: 1,
                    time: 2000
                });
            }
            ,error: function(){
                return layer.msg('拍品图片上传异常',{
                    icon: 2,
                    time: 2000
                });
            }
        });

        //监听提交
        form.on('submit(edit)', function(data){
            data.field.endTimeStr = $("#endTime").val().trim();
            var res = tool.submit(baseUrl + '/edit',data.field);
            if(res.code == return_200){
                layer.msg(res.msg, {
                        icon: msg.success,
                        time: 2000
                    },
                    function(){
                        xadmin.father_reload();
                    }
                );
            }else {
                layer.msg(res.msg, {
                        icon: msg.error,
                        time: 2000
                    },
                    function(){
                        xadmin.father_reload();
                    }
                );
            }
            return false;
        });
        
    });
</script>
</body>
</html>